<html>
	<head>
		<link rel="stylesheet" href="style.css" type="text/css"/>
		<script language="JavaScript" src="scripts/jquery-1.4.2.min.js"></script>
		<script>
			var bg = chrome.extension.getBackgroundPage();

			  chrome.tabs.getSelected(null, function(tab) {
				bg.ifTabExist(tab, function(unreadItem){
					if (unreadItem)
						document.getElementById("addremovebutton").value = 'Remove current page from LRL list';
					else
						document.getElementById("addremovebutton").value = 'Add current page to LRL list';
				});
			  });

			$(document).ready(function(){

				drawtable();

				setTimeout(function(){
					chrome.bookmarks.getChildren(bg.lrlBmId, function(childArr){
						$.each(childArr, function(pos, bmUnreadItem){
							$('#img_' + bmUnreadItem.id).attr('src', 'chrome://favicon/' + bmUnreadItem.url);
						});
					});
				},1000);
			});

			function drawtable(){
				chrome.bookmarks.getChildren(bg.lrlBmId, function(childArr){
					$.each(childArr, function(pos, bmUnreadItem){
						$('<tr id="' + bmUnreadItem.id + '">').prependTo('tbody');

						$('<td> <img id="img_' + bmUnreadItem.id  + '" width="16" height="16" class=\"icon\" /> </td>').appendTo("tr:eq(0)");

						$('<td>' + bmUnreadItem.title + '</br><div class="ellipsis" title="' + bmUnreadItem.url + '"><span class="url">' + bmUnreadItem.url + '</span></div></td>').appendTo("tr:eq(0)");
					});

					$("tr").mouseover(function() {
						$("tr.selected").removeClass('selected');
						$(this).addClass('selected');
					});

					$("tr").click(function () {
						chrome.bookmarks.get(this.id, function(unreadItem){
							chrome.tabs.create({
								'url': unreadItem[0].url
							});

							if(bg.opt_getDelOnRead())
								bg.delFromUnReadedList(unreadItem[0]);
						});
					});
				});
			}

      function addRemoveClick() {
        chrome.tabs.getSelected(null, function(tab){ bg.addToUnReadedList(tab); });
        window.close();
      }

	  var _gaq = _gaq || [];
		_gaq.push(['_setAccount', 'UA-21272362-1']);
		_gaq.push(['_trackPageview']);

		(function() {
			var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
			//ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
			ga.src = 'https://ssl.google-analytics.com/ga.js';
			var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
		})();
		</script>
	</head>
	<body>
  <!-- *** oleg added 1 line -->
  <p><input type="button" value="Add/Remove" onclick="addRemoveClick()" id="addremovebutton"></input></p>
	<div style="overflow-y: auto;  width:340; height:400; border:1 #E2E0FF solid; text-align: left;">
		<table border="0" width="100%">
			<tbody>
			</tbody>
		</table>
	</div>
	</body>
</html>
